<template>
  <div>
    <basic-dialog
      :visible.sync="visible"
      :handleClose="handleCloseDialog"
      :title="title"
      :show-footer="false"
      :width="'60%'"
    >
      <BasicForm
        ref="formData"
        :formColumns="FORM_ITEM_LIST"
        :dataSource="formData"
        :defaultExpandStatus="false"
        :isScalingBtn="false"
        :handleSearchForm="handleQueryForm"
        @getFormData="getFormData"
        :colNumOfRow="2"
      />
      <BasicTable
        ref="basicTable"
        showActionCol
        :showSelectCol="false"
        :loading="tableInfo.loading"
        :columns="tableInfo.columns"
        :dataSource="tableInfo.list"
        :pagination="pagination"
        :tableHeight="400"
        :actionRender="actionRender"
        @rowDblclick="handleSelectSupplier"
        @pageChange="handlePageChange"
        @pageSizeChange="handlePageSizeChange"
      />
    </basic-dialog>
  </div>
</template>
<script>
import BasicDialog from '@/components/BasicDialog';
import BasicForm from '@/components/supplier/BasicForm';
import BasicTable from '@/components/supplier/BasicTable';
import BasicPage from '@/mixins/supplier/basicPage';
import { FORM_ITEM_LIST, TABLE_COLUMNS } from '../constants/supplier';
import { querySupplierListService } from '@api/supplier/innerManagement/arrivalTimeManagement';

export default {
  name: 'SelectSupplierDialog',
  mixins: [BasicPage],
  components: {
    BasicDialog,
    BasicTable,
    BasicForm
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: '选择供应商'
    }
  },
  data () {
    return {
      FORM_ITEM_LIST,
      formData: {
        supplierName: '',
        supplierCode: ''
      },
      tableInfo: {
        loading: false,
        list: [],
        columns: TABLE_COLUMNS
      }
    };
  },
  methods: {
    // 操作列
    actionRender (h, { row }) {
      return (
        <div class="table-action">
          <el-button
            size="mini"
            type="text"
            onClick={() => this.handleSelectSupplier(row)}
          > 选择
          </el-button>
        </div>
      );
    },
    async getTableData () {
      const res = await querySupplierListService({ ...this.formData, ...this.pagination }, state => { this.tableInfo.loading = state })
      if (res) {
        const { records, total } = res.result;
        this.tableInfo.list = records;
        this.pagination.total = total;
      }
    },
    // 选择供应商
    handleSelectSupplier (row) {
      this.$emit('getSupplierData', row);
      this.handleCloseDialog();
    },
    // 重置查询条件
    handleResetData (formName) {
      this.$refs[formName].resetFields();
    },
    // 关闭弹框
    handleCloseDialog () {
      this.$emit('update:visible', false);
    },
    // 表格DOM重新渲染
    reloadTableLayout () {
      this.$nextTick(() => {
        this.$refs.basicTable.$refs.elTable.doLayout();
      });
    },
  }
};
</script>
